
<template>
  <div class="other-upLoad">
    <v-form :form="options" :col="16"></v-form>
    <!-- <div class="path" >
      {{typeof options.url.value }}
    </div> -->
    <ul class="link-list">
       <h3>上传结果</h3>
      <li v-for="(item,index) in  paths.value" :key="item+index">

        <span v-text="paths['name'][index]">ch1</span>
        <el-input :value="item" :class="`link${index}`" :readonly="true">
        </el-input>
        <el-button type="primary" icon="el-icon-printer" @click="copy(`link${index}`)"></el-button>
      </li>
    </ul>
  </div>
</template>
<script>
import { upLoad } from './form';
export default {
	data() {
		return {
			options: upLoad,
		};
	},
	computed: {
		paths() {
			try {
				let temp = JSON.parse(this.options.url.value);
				return {
          name:Object.keys(temp),
          value:Object.values(temp)
        };
			} catch (error) {
				return {
          name:[],
          value:[]
        };
			}
		},
	},
	methods: {
		copy(name) {
			// let urlDom = this.$refs.linkx;
			// console.log(urlDom,)
			try {
				let urlDom = document.querySelector(`.link-list .${name} input`).select();
				document.execCommand('Copy');
				log.ok('复制成功');
			} catch (error) {
				console.log(error);
				log.info('复制失败');
			}

			// document.execCommand("Copy");
			// console.log('%c gc_urlDom=>: ', 'color: MidnightBlue; background: Aquamarine; font-size: 20px;', urlDom,name);

			// setTimeout(() => {

			//
			// }, 1000);
		},
	},
};
</script>
<style lang="scss">
.other-upLoad {
  .el-col{
    float: none;
  }
	ul {
    list-style: none;
    li{
      display: flex;
      align-items:center;
      justify-content: space-between;
    }
	}
}
</style>


